/**
 * Created with BlueStream
 * Date: 13. 6. 1
 * Time: 오후 5:41
 * Writer: 강석민
 */
window.onload = function () {

    var page = document.getElementById("sample_page");

    /**첫 번째 영역에 추가하기*/
    // 1-1. 기준이 되는 위치 찾기
    var firstChild = page.firstChild;

    // 1-2. <p> 태그 엘리먼트를 동적으로 생성
    var p1 = document.createElement("p");

    // 1-3. 텍스트 노드 생성
    var text1 = document.createTextNode("추가 내용1");

    // 1-4. p1의 자식 노드로 text1을 추가
    p1.appendChild(text1);
    p1.style.border = "red solid 1px";

    // 1-5. p1을 #sample_page 첫 번째 자식 노드 앞에추가
    page.insertBefore(p1,firstChild);
    /**세 번째 영역에 추가하기*/
    // 3-1. p1 노드를 그대로 복사
    var p2 = p1.cloneNode(true);

    // 3-2. 텍스트 노드를 수정
    p2.firstChild.nodeValue = "추가 내용2";

    // 3-3. p2를 #sample_page 노드의 마지막 위치에 추가
    page.appendChild(p2);


}





















